<div style="margin-top:45px;" v-if="status">

	<!-- 图标 -->
	<a-alert v-if="!status.connect"
		message="警告"
		description="洛克人眼保健操掉线啦！！！"
		type="warning"
		showIcon
	></a-alert>

	<template v-if="status.data">
		<!-- 音量 -->
		<a-descriptions title="音量设置" style="margin-top:30px;"></a-descriptions>
		<a-row>
			<p>
				<a-button-group>
					<a-button                :disabled="!(audioVolumeDirty || seVolumeDirty)"
						@click="btnVolumeReset" >刷新音量</a-button>
					<a-button type="primary" :disabled="!(audioVolumeDirty || seVolumeDirty)"
						@click="btnVolumeSubmit">提交音量</a-button>
				</a-button-group>
				&emsp;
				<i v-show="audioVolumeDirty || seVolumeDirty">
					音量也是单独要点 <b style="color:crimson;">提交</b> 按钮才生效。
				</i>
			</p>
		</a-row>
		<a-form>
			<a-form-item :label-col="{span : 4}" :wrapperCol="{span: 18}" label="音乐音量" style="margin-bottom: 1px;">
				<a-slider v-model="audioVolume" :min="0" :max="100" :step="1" @afterChange="onAudioVolumeChange"></a-slider>
			</a-form-item>
			<a-form-item :label-col="{span : 4}" :wrapperCol="{span: 18}" label="音效音量" style="margin-bottom: 1px;">
				<a-slider v-model="seVolume" :min="0" :max="100" :step="1" @afterChange="onSeVolumeChange"></a-slider>
			</a-form-item>
		</a-form>

	</template>

</div>
